border -
left - style
|
|
|
|
|
|
|||||||||
|
7.0 |
8.0 |
9.0 |
7.0 |
8.0 |
9.6 |
10.0 |
10.0 |
3.1 |
4.0 |
5.0 |
3.0 |
3.6 |
4.0 |
|
Помилка |
Так |
Так |
Так |
Так |
Так |
Так |
Так |
Так |
Так |
Так |
Так |
Так |
Так |
Коротка інформація
|
CSS |
CSS1,
CSS2.1 |
|
Значення
за умовчанням |
Ні |
|
Наслідує |
Ні |
|
Застосовується |
До усіх
елементів |
|
Аналог
HTML |
<img
border > | <table border> |
|
Посилання
на специфікацію |
http://www.w
3.org/TR/CSS21/box.html#border - style - properties |
Опис
Встановлює
стиль межі зліва від елементу.
Синтаксис
border -
left - style: none | hidden | dotted | dashed | solid | double | groove | ridge
| inset | outset | inherit
Значення
none Лінія не відображається і значення її товщини обнуляється.
hidden Має той же ефект, що і none за винятком застосування
border - left - style до елементів таблиці, у якої значення властивості border,
- collapse встановлене як collapse. В цьому випадку ліва межа в осередку не
відображатиметься взагалі.
dotted Лінія складається з набору точок.
dashed Пунктирна лінія, що складається з серії коротких
відрізків.
solid Суцільна лінія.
double Подвійна лінія.
groove Створює ефект втиснутої лінії.
ridge Створює ефект рельєфної лінії.
inset Псевдотривимірна лінія.
outset Псевдотривимірна лінія.
inherit Наслідує значення батька.
Вид вказаних
стилів представлений на мал. 1.
Рис.1. Стилі
меж
Приклад
HTML 4.0 CSS 2.1 IE 6 IE 7 IE 8 Op 9.5 Sa 3.1 Ff 2.0 Ff 3.0
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN""http
://www.w 3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type"
content="text/html; charset=windows - 1251">
<title>border - left -
style</title>
<style type="text/css">
DIV.line {
border-left-color: red; /* Колір лінії
ліворуч */
border-left-style: double; /* Стиль лінії
*/
border-left-width: 7px; /* Товщина лінії */
padding-left: 10px; /* Відстань між лінією і текстом */
}
</style>
</head>
<body>
<div class="line">
Луцький національний технчний університет є одним із
найкращих професійних закладів освіти у місті Луцьку. Найкращою з підготовки
спеціалістів є кафедра професійного навчання, що займається професійною
підготовкою студентів. </div>
</body>
</html>
Результат
цього прикладу показаний ні мал. 2.
Мал. 2.
Використання властивості border - left - style
Об'єктна модель
[window.]document.getElementById("elementID").style.borderLeftStyle
Браузери
Браузер
Internet Explorer до шостої версії включно при товщині межі 1px відображає
dotted як dashed. При товщині 2px і вище значення dotted працює коректно. Ця
помилка виправлена в IE7, але тільки для усіх меж завтовшки 1px. Якщо одна з
меж блоку має товщину 2px і вище, то в IE7 значення dotted перетворюється на
dashed.
Internet
Explorer до сьомої версії включно не підтримує значення hidden і inherit.
Стиль межі в
різних браузерах може дещо розрізнятися при використанні значень groove, ridge,
inset або outset.